@font-face{
	src: url(../fonts/RockSalt-Regular.ttf);
	font-family: rock;

}
@font-face{
	src: url(../fonts/Amburegul.otf);
	font-family: amb;
}

@font-face{
	src: url(../fonts/khand.ttf);
	font-family: khand;
}



@font-face{
	src: url(../fonts/AmburegulSmall.otf);
	font-family: ambsmall;
}












*{
	margin: 0;
	padding: 0;

}

a{
	text-decoration: none;
}


html {
	height: 100%;
	scroll-behavior: smooth;
	/*background-image: url(../images/IMG_7771.jpg);*/
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
    background-color:rgba(39,39,39,1.00);
	overflow-x: hidden;
	font-family: verdana,;
		
	
	
}
body{
	
	height: 100%;
	
	
	overflow-x: hidden;
	
	background-image: url(../images/IMG_7771.jpg);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	

	
}


.pattern-background{
	background-image: -webkit-linear-gradient(270deg,rgba(0,0,0,1.00) 15.03%,rgba(0,0,0,0.81) 29.53%,rgba(0,0,0,0.39) 48.18%,rgba(0,0,0,0.72) 63.73%,rgba(0,0,0,1.00) 86.01%), url(../images/backgriund.png);
	background-image: -moz-linear-gradient(270deg,rgba(0,0,0,1.00) 15.03%,rgba(0,0,0,0.81) 29.53%,rgba(0,0,0,0.39) 48.18%,rgba(0,0,0,0.72) 63.73%,rgba(0,0,0,1.00) 86.01%), url(../images/backgriund.png);
	background-image: -o-linear-gradient(270deg,rgba(0,0,0,1.00) 15.03%,rgba(0,0,0,0.81) 29.53%,rgba(0,0,0,0.39) 48.18%,rgba(0,0,0,0.72) 63.73%,rgba(0,0,0,1.00) 86.01%), url(../images/backgriund.png);
	background-image: linear-gradient(180deg,rgba(0,0,0,1.00) 15.03%,rgba(0,0,0,0.81) 29.53%,rgba(0,0,0,0.39) 48.18%,rgba(0,0,0,0.72) 63.73%,rgba(0,0,0,1.00) 86.01%), url(../images/backgriund.png);
	background-position: center;
	background-size: contain;
	background-repeat: repeat;
}




#pagecontainer{
	
		
	
}

.parallex{
	position: absolute!important;
	
	
}



main{
	display: block;
	position: relative;
	background-position: 100% 100%;
	background-size: contain;	
	background-color: rgba(245,245,245,1.00);
	animation: pageentry 300ms ease-out;
	animation-fill-mode: forwards;
}

@keyframes pageentry{
	
	0%{
		opacity: 0.5;
		transform: scale(1.01);
		
	}
	
	
	

	75%{
		transform: scale(1.01);
	}
	
	
	
	100%{
		opacity: 1;
		transform: scale(1.0);
		
	}
}

section{
	display: block;
	position: relative;
	width: 100%;
	background-color:transparent;
	height: auto;
}



.white{
	color: white !important;
	text-decoration: none!important;
	
}

.white a{
	color: white!important;
	text-decoration-color: white!important;
	text-decoration: none!important;
	
}

.white p{
	
	color: white !important;
}

.white ul, li{color: white!important;}

.white h1 h2 h3 h4 h5 h6 {
	color: white ;
}


/*
.black , a {
	color: black!important;
}
*/

.black{
	color: black !important;
	background-color: black !important;
	margin-top: 0px;
}

.black header #navbar ul li a {
	color: black !important;
}


.black header #mobilenav #menuToggle span{
	background-color: black !important;
	
}


.black header #mobilenav #menuToggle .ham-menu-control:checked ~ span
{

	background-color: rgba(255,255,255,1.00)!important;
	
	
}





.fullscreen-bg {
	width: 100%;
	height: 100%;
	overflow: hidden;
	z-index: -100;
	margin: 0;
	position: fixed;
	top: 0px;
	bottom: 0px;
	right: 0px;
	left: 0px;
	display: none;

}

.crossfade > figure {
  animation: fadeBackground 20s linear infinite;
  backface-visibility: hidden;
  background-size: cover;
  background-position: center center;
  color: transparent;
  height: 100%;
  left: 0px;
  opacity: 0;
  position: absolute;
  top: 0px;
  width: 100%;
  z-index: -1000;

	
}


.crossfade > figure:nth-child(1)  {
	animation-delay: 0s;
	background-image: url(../images/21.jpg);			
}
.crossfade > figure:nth-child(2) {
	animation-delay: 4s;
	background-image: url(../images/122.jpg);	
}
.crossfade > figure:nth-child(3) {
	animation-delay: 8s;
	background-image: url(../images/Tree.jpg);
}
.crossfade > figure:nth-child(4)  {
	animation-delay: 12s;
	background-image: url(../images/Humpback%20Whale.jpg);
}
.crossfade > figure:nth-child(5)  {
	animation-delay: 16s;
	background-image: url(../images/12.jpg);
}




/* Preloder */



.prealoader{
	
	animation: disolve 1s linear;
	animation-delay: 2s;
	position: fixed;
	width: 100vw;
	height: 100vh;
	z-index: 999999;
	animation-fill-mode: forwards;
	background-repeat: no-repeat;
	background-size: cover;
	background-image: url(../images/preloader.png);
	background-position: center center;
}













@keyframes disolve {
  0% {
	  z-index: 999999999;

    opacity: 1;
  }
	
	
	
  99.9% {
	  opacity: 0;
	  z-index: 9999999;
  }
	100%{
		
		z-index: -9999999999;
		opacity: 0;
		
	}
	
}














#myimg {
  border-radius: 5px;
  cursor: pointer;
  transition: 0.3s;
}

#myimg:hover {opacity: 0.3;}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  /* Location of the box */
  left: 0;
  top: 0;

  width: 100%; /* Full width */
  height: 100em; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
}

/* Modal Content (image) */
.modal-content {
  margin: auto;
  display: block;
  width: 90%;
  max-width: 100%;
}

/* Caption of Modal Image */
#caption {
  margin: auto;
  display: block;
  width: 80%;
  max-width: 700px;
  text-align: center;
  color: #ccc;
  padding: 10px 0;
  height: 150px;
}

/* Add Animation */
.modal-content, #caption {  
  -webkit-animation-name: zoom;
  -webkit-animation-duration: 0.6s;
  animation-name: zoom;
  animation-duration: 0.6s;
}

@keyframes zoom {
  0% {
	  transform:scale(0)
	} 
  100%{
	 transform:scale(1)
	}
}


/* The Close Button */
.close {
  position: absolute;
  top: 15px;
  right: 35px;
  color: #f1f1f1;
  font-size: 40px;
  font-weight: bold;
  transition: 0.3s;
}

.close:hover,
.close:focus {
  color: #bbb;
  text-decoration: none;
  cursor: pointer;
}

/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 700px){
  .modal-content {
    width: 100%;
  }
}




@media (min-width: 48em) {
	
	

	


}
